<div class="layui-fluid" id="VIEW-list-table" >
    <div class="layui-row layui-col-space10">
        <div class="layui-col-md6">
            <div class="layui-card">
                <div class="layui-card-body nepadmin-table-full">
                    <div class="layui-btn-container nepadmin-pad-t10 nepadmin-pad-l10">
                        <div class="layui-btn layui-btn-sm" onclick="dictList.addType()">添加</div>
                        <div class="layui-btn layui-btn-sm" onclick="dictList.test()">实例页</div>
                    </div>
                    <table id="dictTypeListId" lay-filter="dictTypeList"></table>
                </div>
            </div>
        </div>
        <div class="layui-col-md6">
            <div class="layui-card">
                <div class="layui-card-body nepadmin-table-full">
                    <div class="layui-btn-container nepadmin-pad-t10 nepadmin-pad-l10">
                        <div class="layui-btn layui-btn-sm" id="addDictVal" onclick="dictList.addTypeVal()">添加</div>
                    </div>
                    <input type="hidden" value="" id="dictId" />
                    <table id="dictValListId" lay-filter="dictValList"></table>
                </div>
            </div>
        </div>
    </div>
    <script type="text/html" id="barDemo">
        <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
    </script>
</div>
<script>
    var dictList = {};
    var DictList = function (layui) {
        var admin = layui.admin, table = layui.table, form = layui.form, $ =layui.jquery;
        //初始化列表
        this.init = function () {
            //初始化字典值
            dictList.initDictVal();
            //数据字典类型
            admin.table({
                id:'dictTypeListId',
                elem: '#dictTypeListId',
                api: 'pageDictTypeList',
                height: 'full-130',
                formId: 'form',
                tableFilter:'dictTypeList',
                page: false,   //不分页
                rowClick:true,      //点击一行事件
                cols: [[
                    {title: '序号', type: 'numbers', fixed: true, width: 60},
                    {title: '字典类型', field: 'dictName', edit: 'text'},
                    {title: '字典编码', field: 'dictCode', edit: 'text'},
                    {title: '操作',fixed: 'right', width: 120, align:'center', toolbar: '#barDemo'}
                ]],
                tools:{
                    //点击一行
                    rowClick:function (row) {
                        $("#addDictVal").html("【"+row.dictName+"】新增");
                        dictList.searchDictVal(row.id);
                        $("#dictId").val(row.id);
                    },
                    del:function (row) {
                        admin.confirm("是否删除？",function () {
                            var ids = [];
                            ids.push(row.id);
                            admin.post({
                                api:'deleteDictType',
                                data:JSON.stringify(ids),
                                contentType: 'application/json;charset=UTF-8',
                                success:function (res) {
                                    if(res.code == 0){
                                        admin.success('操作成功',function () {
                                            admin.tableSearch('searchForm','dictTypeListId');
                                        });
                                    }
                                }
                            });
                        })
                    }
                },
                filter:[{
                    types:'table',   //   注：仅支持 from 、table 两种类型  监听 table的 tools 请使用 tools 属性
                    filterTypes: 'edit',   //
                    filterName: 'dictTypeList',
                    returnData : function (obj) {
                        admin.post({
                            api:'updateDictType',
                            data:JSON.stringify(obj.data),
                            contentType: 'application/json;charset=UTF-8',
                            success:function (res) {
                                dictList.refreshDictType();
                            }
                        });
                    }
                }]
            });
        };
        //刷新类型
        this.refreshDictType = function () {
            admin.tableSearch('searchForm','dictTypeListId');
        };
        //刷新值
        this.refreshDictTypeVal = function () {
            admin.tableSearch('searchForm','dictValListId');
        };
        //新增类型
        this.addType = function () {
            //提交用户
            admin.post({
                api:'saveDictType',
                data:JSON.stringify({
                    dictName:'类型名称',
                    dictCode:'类型编码'
                }),
                contentType: 'application/json;charset=UTF-8',
                success:function (res) {
                    dictList.refreshDictType();
                }
            });
        };
        //新增类型值
        this.addTypeVal = function () {
            if($("#dictId").val()){
                //提交用户
                admin.post({
                    api:'saveDictValList',
                    data:JSON.stringify({
                        valName:'字典值名称',
                        valCode:'字典值编码',
                        dictId: $("#dictId").val()
                    }),
                    contentType: 'application/json;charset=UTF-8',
                    success:function (res) {
                        dictList.refreshDictTypeVal();
                    }
                });
            }else{
                admin.error('请选择类型');
            }
        };
        //初始化值
        this.initDictVal = function () {
            admin.table({
                id: 'dictValListId',
                elem: '#dictValListId',
                api: 'pageDictValList',
                height: 'full-130',
                formId: 'form',
                where:{
                    dictId: -1
                },
                tableFilter:'dictValList',
                page:false,   //不分页
                cols: [[
                    {title: 'ID', field: 'id', fixed: true, width: 60},
                    {title: '字典值名称', field: 'valName', edit: 'text'},
                    {title: '字典值编码', field: 'valCode', edit: 'text'},
                    {title: '操作',fixed: 'right', width: 120, align:'center', toolbar: '#barDemo'}
                ]],
                tools:{
                    del:function (row) {
                        admin.confirm("是否删除？",function () {
                            var ids = [];
                            ids.push(row.id);
                            admin.post({
                                api:'deleteDictValList',
                                data:JSON.stringify(ids),
                                contentType: 'application/json;charset=UTF-8',
                                success:function (res) {
                                    if(res.code == 0){
                                        admin.success('操作成功',function () {
                                            dictList.refreshDictTypeVal();
                                        });
                                    }
                                }
                            });
                        })
                    }
                },
                filter:[{
                    types:'table',   //   注：仅支持 from 、table 两种类型  监听 table的 tools 请使用 tools 属性
                    filterTypes: 'edit',   //
                    filterName: 'dictValList',
                    returnData : function (obj) {
                        admin.post({
                            api:'updateDictValList',
                            data:JSON.stringify(obj.data),
                            contentType: 'application/json;charset=UTF-8',
                            success:function (res) {
                                dictList.refreshDictTypeVal();
                            }
                        });
                    }
                }]
            });
        };
        //条件搜索
        this.searchDictVal = function (dictId) {
            table.reload('dictValListId',{
                where: {
                    dictId: dictId
                }
            });
        };
        this.test = function () {
            admin.popup({
                title:'新增用户',
                url:'/sys/dict/test',
                success:function (layer,index) {
                    var test = new Test(index);
                    test.init();
                }
            });
        };
    };
    //引入组件
    layui.use(['admin', 'table', 'form', 'jquery'], function () {
        dictList = new DictList(layui);
        dictList.init();
    });
</script>